<template>
  <div class="box">
    <div class="header">
      活动公告
    </div>
    <div class="content">
      <div>
        <div class="date">
          <div class="cirle"></div>
          2024-12-27至2024-12-27
        </div>
        <div class=""></div>
        <el-row>
          <el-col :span="6">
            <div class="pic"></div>
          </el-col>
          <el-col :span="18">
            <div class="title">
              中国粮食市场峰会
              <div class="button">活动报名</div>
            </div>
            <div class="dress">
              <!-- <Edit style="width: 1em; height: 1em; margin-right: 8px" /> -->
              河南省郑州市</div>
            <div class="detail">
              粮稳天下安。2024年中央1号文件提出要扎实推进新一轮千亿斤粮食产能提升行动，适当提高小麦最低收购价，合理确定稻谷最低收购价，优化生猪产能调控机制。当前全球百年未有之大变局加速演变，国际形势跌宕起伏。近年来频发的灾害性极端天气及社会性“黑天鹅”或“灰犀牛”事件对全球及国内粮食市场的冲击......
            </div>
            <el-icon color="#409efc" class="no-inherit">
                <!-- <Share /> -->
              </el-icon>
          </el-col>
        </el-row>
      </div>
      <div>
        <div class="date">
          <div class="cirle"></div>
          2024-12-27至2024-12-27
        </div>
        <div class=""></div>
        <el-row>
          <el-col :span="6">
            <div class="pic"></div>
          </el-col>
          <el-col :span="18">
            <div class="title">
              中国粮食市场峰会
              <div class="button">活动报名</div>
            </div>
            <div class="dress">
              <!-- <Edit style="width: 1em; height: 1em; margin-right: 8px" /> -->
              河南省郑州市</div>
            <div class="detail">
              粮稳天下安。2024年中央1号文件提出要扎实推进新一轮千亿斤粮食产能提升行动，适当提高小麦最低收购价，合理确定稻谷最低收购价，优化生猪产能调控机制。当前全球百年未有之大变局加速演变，国际形势跌宕起伏。近年来频发的灾害性极端天气及社会性“黑天鹅”或“灰犀牛”事件对全球及国内粮食市场的冲击......
            </div>
            <el-icon color="#409efc" class="no-inherit">
                <!-- <Share /> -->
              </el-icon>
          </el-col>
        </el-row>
      </div>
      <div>
        <div class="date">
          <div class="cirle"></div>
          2024-12-27至2024-12-27
        </div>
        <div class=""></div>
        <el-row>
          <el-col :span="6">
            <div class="pic"></div>
          </el-col>
          <el-col :span="18">
            <div class="title">
              中国粮食市场峰会
              <div class="button">活动报名</div>
            </div>
            <div class="dress">
              <!-- <Edit style="width: 1em; height: 1em; margin-right: 8px" /> -->
              河南省郑州市</div>
            <div class="detail">
              粮稳天下安。2024年中央1号文件提出要扎实推进新一轮千亿斤粮食产能提升行动，适当提高小麦最低收购价，合理确定稻谷最低收购价，优化生猪产能调控机制。当前全球百年未有之大变局加速演变，国际形势跌宕起伏。近年来频发的灾害性极端天气及社会性“黑天鹅”或“灰犀牛”事件对全球及国内粮食市场的冲击......
            </div>
            <el-icon color="#409efc" class="no-inherit">
                <!-- <Share /> -->
              </el-icon>
          </el-col>
        </el-row>
      </div>
    </div>
  </div>
</template>

<script>

</script>

<style lang="scss" scoped>
  .box{
    height: 376px;
    background-color: #fafafa;
    color: #222;
    .header{
      width: 100%;
      height: 32px;
      line-height: 32px;
      box-sizing: border-box;
      padding-left: 45px;
      background-color: #f0f6fa;
    }
    .content{
      height: 300px;
      padding: 20px;
      overflow-y: scroll;
      // overflow-y: ;
      .date{
        font-size: 14px;
        margin-bottom: 12px;
        display: flex;
        align-items: center;
        .cirle{
          width: 8px;
          height: 8px;
          border-radius: 50%;
          background-color: #1A52A5;
          margin: 0 8px;
        }
      }
      .pic{
        width: 150px;
        height: 98px;
        margin: auto;
        border-radius: 4px;
        background-color: #cccccc;
      }
      .title{
        display: flex;
        justify-content: space-between;
        .button{
          width: 104px;
          height: 24px;
          border-radius: 4px;
          background-color: #1A52A5;
          color: #fff;
          font-size: 12px;
          line-height: 24px;
          text-align: center;
          cursor: pointer;
        }
      }
      .dress{
        font-size: 12px;
      }
      .detail{
        font-size: 12px;
      }
    }
  }
</style>